<template>
     <el-table :data="assData" border style="width: 100%" stripe>
            <el-table-column prop="index" label="#" width="50"></el-table-column>
            <el-table-column prop="authName" label="权限名称" width="400"></el-table-column>
            <el-table-column prop="path" label="路径" width="600"></el-table-column>
            <el-table-column  label="权限等级">
                <template slot-scope="scope">
                    <el-tag prop="level" :type="scope.row.type">{{scope.row.lvName}}</el-tag>
                </template>
            </el-table-column>
    </el-table>
</template>

<script>
export default {
    data(){
      return {
        assData:[]
      }
    },
    methods:{
        //获取权限列表数据
        getAssData(){
            this.$http.get("rights/list",{headers:{"Authorization":localStorage.getItem("token")}})
            .then(res=>{
                this.assData = res.body.data
                //console.log(this.assData)
                //给获取的数据添加相应的属性 渲染列表时候需要使用
               this.assData.forEach((item,i)=>{
                   item.index = i+1;
                  switch(item.level){
                    case "0":
                        item.type = "";
                        item.lvName = "一级"
                            break;
                    case "1":
                        item.type = "success";
                            item.lvName = "二级"
                        break;
                    case "2":
                        item.type = "warning"; 
                            item.lvName = "三级"
                        break;
                    }
                })
            })
        }
    },
    created() {
            this.getAssData()
            this.$store.commit("changeTitle",{"t1":"权限管理","t2":"权限列表"})
        },
}
</script>

 <style lang="scss" scoped>

</style>